<template>
  <div id="older">
    <router-view />
    <van-tabbar class="nav-bar" v-model="active">
      <van-tabbar-item to="/older/home">首页</van-tabbar-item>
      <van-tabbar-item to="/older/information">消息</van-tabbar-item>
      <van-tabbar-item to="/older/health">健康</van-tabbar-item>
      <van-tabbar-item to="/older/personal">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>


<script>
export default {
  data() {
    const active = 0;
    return { active };
  },
};
</script>
<style>
#older {
  position: absolute;
  width: 100%;
  height: 100%;
}
.nav-bar {
  height: 8%;
  z-index: 10;
}
.nav-bar .van-tabbar-item .van-tabbar-item__icon .van-icon {
  font-size: 40px;
}
</style>
<style scoped>
.nav-bar {
  height: 60px;
}
.van-tabbar-item {
  font-size: 14px;
  line-height: 1.2;
  padding-top: 8px;
  /* 禁用点击反馈动画 */
  transition: none;
  transform: none;
}
</style>